<template>
   <text :x="point.x" :y="point.y">{{stat.label}}</text>
</template>

<script>
const { valueToPoint } = require('./helper')
export default {
  name: 'axislabel',

  // a sub component for the labels
  props: {
    stat: Object,
    index: Number,
    total: Number
  },

  computed: {
    point: function () {
      return valueToPoint(
      +this.stat.value + 10,
      this.index,
      this.total
      )
    }
  },

  mounted () {
    console.log('load')
    console.log('stat: ', this.stat)
  },

  methods: {
  }
}
</script>

<style lang="stylus" rel="stylesheet/stylus">
</style>
